import 'package:FlutterDemo/bean/beans_factory.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

/// 构建简单的SingleChildScrollView示例
buildSampleSingleChildScrollView() {
  return SingleChildScrollView(
    child: Column(
      children: List.generate(50, (index) {
        return Container(
          height: 150,
          color: Colors.primaries[index % Colors.primaries.length],
        );
      }).toList(),
    ),
  );
}

/// 构建简单的SingleChildScrollView示例: 这里有问题不能使用
buildSampleHorizontalSingleChildScrollView() {
  return SingleChildScrollView(
    scrollDirection: Axis.horizontal,
    reverse: false,
    padding: EdgeInsets.all(10),
    // 滑动到底部回弹效果
    physics: BouncingScrollPhysics(),
    child: Column(
      children: [
        // Container(
        //   height: 220,
        //   child: Row(
        //     children: buildSampleColorList(),
        //     // children: buildSampleImgList(),
        //   ),
        // ),
        Container(
          height: 220,
          margin: EdgeInsets.only(top: 50),
          child: Row(
            children: buildSampleImgList(),
          ),
        ),
      ],
    ),
  );
}

buildSampleImgList() {
  List<String> imgUrls = BeansFactory.instance.buildSampleListUrls();
  List<Widget> widgets = <Widget>[];
  for (var value in imgUrls) {
    widgets.add(Container(
      margin: EdgeInsets.only(left: 10),
      child: Image.network(value),
    ));
  }
  return widgets;
}

/// 构建示例颜色列表
buildSampleColorList() {
  List<Widget> widgets = [];
  widgets.add(Container(
    color: Colors.primaries[0],
    margin: EdgeInsets.only(top: 10),
    width: 440,
  ));

  widgets.add(Container(
    color: Colors.primaries[1],
    margin: EdgeInsets.only(left: 20, top: 10),
    width: 540,
  ));
  return widgets;
}

buildSampleHorizontalSingleChildScrollView2() {
  // return SamplePageListWidget();
  return SamplePageListWidget2();
}

class SamplePageListWidget extends StatefulWidget {
  const SamplePageListWidget({Key? key}) : super(key: key);

  @override
  _SamplePageListWidgetState createState() => _SamplePageListWidgetState();
}

class _SamplePageListWidgetState extends State<SamplePageListWidget> {
  List<String> imgUrls = BeansFactory.instance.buildSampleListUrls();
  late Widget contentItem;

  @override
  void initState() {
    super.initState();

    setState(() {
      contentItem = buildSampleColorSList();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: [Container()],
      ),
    );
  }

  buildSampleColorSList() {
    return Container(
      height: 220,
      child: Row(
        children: buildSampleColorList(),
        // children: buildSampleImgList(),
      ),
    );
  }

  buildSampleImgSList() {
    return Container(
      height: 220,
      child: Row(
        children: buildSampleImgList(),
      ),
    );
  }
}

class SamplePageListWidget2 extends StatefulWidget {
  const SamplePageListWidget2({Key? key}) : super(key: key);

  @override
  _SamplePageListWidget2State createState() => _SamplePageListWidget2State();
}

class _SamplePageListWidget2State extends State<SamplePageListWidget2> {
  List<String> imgUrls = BeansFactory.instance.buildSampleListUrls();
  late Widget placeHolderWidget;

  @override
  void initState() {
    super.initState();

    placeHolderWidget = buildColorListSingleChildScrollView();
  }

  @override
  Widget build(BuildContext context) {
    // return buildTestContainer();
    return ListView(
      children: [buildTestContainer()],
    );
  }

  /// 列表容器：不要直接使用
  Container buildTestContainer() {
    return Container(
      child: Column(
        children: [
          Text("颜色列表"),
          buildColorListSingleChildScrollView(),
          Text("图片列表"),
          buildImgListSingleChildScrollView(),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              FlatButton(
                onPressed: () {
                  setState(() {
                    placeHolderWidget = buildColorListSingleChildScrollView();
                  });
                },
                child: Text("列表模式"),
                color: Colors.orangeAccent,
              ),
              FlatButton(
                onPressed: () {
                  setState(() {
                    placeHolderWidget = buildImgListSingleChildScrollView();
                  });
                },
                child: Text("图片列表模式"),
                color: Colors.deepOrange,
              )
            ],
          ),
          Container(
            child: placeHolderWidget,
          )
        ],
      ),
    );
  }

  /// 构建颜色列表
  SingleChildScrollView buildColorListSingleChildScrollView() {
    return SingleChildScrollView(
      scrollDirection: Axis.horizontal,
      reverse: false,
      child: Container(
        height: 220,
        margin: EdgeInsets.only(left: 20, right: 20),
        child: Row(
          // children: [
          //   Container(
          //     color: Colors.primaries[0],
          //     width: 440,
          //   ),
          //   Container(
          //     color: Colors.primaries[1],
          //     margin: EdgeInsets.only(left: 20),
          //     width: 540,
          //   )
          // ],
          children: buildColorList(),
        ),
      ),
    );
  }

  /// 构建图片列表
  SingleChildScrollView buildImgListSingleChildScrollView() {
    return SingleChildScrollView(
      scrollDirection: Axis.horizontal,
      reverse: false,
      child: buildSampleImgSList2(),
    );
  }

  buildSampleImgSList2() {
    return Container(
      height: 220,
      child: Row(
        children: buildSampleImgList(),
      ),
    );
  }

  /// 构建颜色列表
  buildColorList() {
    List<Widget> colorWidgets = <Widget>[];
    var _margin = EdgeInsets.only(left: 20);
    for (int i = 0; i < 5; i++) {
      var container;
      if (i == 0 || i == Colors.primaries.length - 1) {
        container = Container(
          color: Colors.primaries[i],
          width: 440,
        );
      } else {
        container = Container(
          color: Colors.primaries[i],
          width: 440,
          margin: _margin,
        );
      }
      colorWidgets.add(container);
    }
    return colorWidgets;
  }
}
